<template>
    <div class="index-quality">
            <div class="title" style="padding-top: 10px; text-align: center; width: 100%;padding-bottom: 10px;margin-bottom: 10px;">
                <span style="font-size: 40px;">业务/</span>
                <span style="text-transform: uppercase;color: #999; font-size: 36px;">Business</span>
            </div>
            <!-- 中间三个盒子在一起，点击跳转，看看有没有这样的布局 -->
            <div style="height: 400px;">
                <el-row style="height: 350px; display: flex; padding-left: 300px ">
                    <el-col :span="6" style="border: solid;">
                        <div class="grid-content bg-purple" style="height: 300px; width: 300px;">
                            <img :src="require('@/assets/icon/personManager.png')" class="imgCss">
                            <span class="spanCss">人力管理管理</span>
                            <van-icon class="iconfont icon-quanquanxiangyoujiantou" class-prefix="icon"
                                name="icon-quanquanxiangyoujiantou" style="display: flex;padding: 10px 135px;">
                            </van-icon>
                        </div>
                    </el-col>
                    <el-col :span="6" style="border: solid;">
                        <div class="grid-content bg-purple-dark">
                            <div class="grid-content bg-purple" style="height: 300px; width: 300px;">
                                <img :src="require('@/assets/icon/idIcon.png')" class="imgCss" />
                                <span style="display: flex; padding: 0 118px;">企业培训</span>
                                <van-icon class="iconfont icon-quanquanxiangyoujiantou" class-prefix="icon"
                                    name="icon-quanquanxiangyoujiantou" style="display: flex;padding: 10px 135px;">
                                </van-icon>
                            </div>
                        </div>
                    </el-col>
                    <el-col :span="6" style="border: solid;">
                        <div class="grid-content bg-purple-light">
                            <div class="grid-content bg-purple" style="height: 300px; width: 300px;">
                                <img :src="require('@/assets/icon/personManager.png')" class="imgCss" />
                                <span style="display: flex;padding: 0 66px;">外资在华事务所代理</span>
                                <van-icon class="iconfont icon-quanquanxiangyoujiantou" class-prefix="icon"
                                    name="icon-quanquanxiangyoujiantou" style="display: flex;padding: 10px 135px;">
                                </van-icon>
                            </div>


                        </div>
                    </el-col>
                </el-row>
            </div>
        </div>
</template>

<script>

export default{
    name:'Index'
}
</script>

<style scoped>
.imgCss {
    height: 150px;
    width: 150px;
    padding-top: 20px;
    padding: 45px 76px;
}

</style>